<%@ page pageEncoding="UTF-8" contentType="text/html; charset=utf-8"  %>
<html>
<head>
<%@ include file="/user/load_user_with_redirect.jsp" %>
<%
	String id = request.getParameter("id");
	org.languageguide.readings.Reading reading = new org.languageguide.readings.ReadingImpl(id);
	String text = reading.getWordWrappedReading();
	String times = reading.getTimes();
	String soundPath = reading.getSoundPath();
	String adjustedWordIds = reading.getAdjustedWordsIds();
	//String checkedWordIdLists = reading.getCheckedWordsIdList();
	if (soundPath == null){
		// forward to page to upload sound file
		//soundPath						
	}
%>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="scripts/sound2.js"></script>
<script type="text/javascript">
	var id = <%= id %>;
	var times = [<%= times %>];
	var adjustedWordIds = [<%= adjustedWordIds %>];	
	var wordCount = <%= reading.getWordCount() %>;
	//var highestIdChecked = %= reading.getHighestIdChecked() %;
	//var highestIdAdjusted  = %= reading.getHighestIdAdjusted() %;
</script>
<style type="text/css">
	#confirmation{
		display:none;
	}
</style>
</head>
<body onLoad="init()">
<div style="width: 500px; display:inline;" >
	<% if (!request.getHeader("Host").equals("localhost:8080")){ %>
      <audio id="player" controls src="http://languageguide.org:90<%= soundPath %>"></audio>  
    <% } else{%>
      <audio id="player" controls src="<%= soundPath %>"></audio>      
     <% } %>


<div style="display:inline; margin-left: 50px;">
<button disabled name="save" id="save" onClick="javascript:save()">Save</button>
<button name="exit" id="exit" onClick="javascript:exit()">Exit</button>
</div> <div style="display:inline; width: 198px;" id="message">&nbsp;</div></div>
<div style="float:right">
<a href="docs/fine-tuning-sound-integration.html" target="_blank">Help</a></div>
<input name="adjust" id="adjust" type="text" size="4">  
<button name="save" id="save" onClick="javascript:adjust()">Adjust</button>
<!--<select id="time_adjuster" style="float:right;" onChange="javascript:adjustSelection()">
  <option value="0"></option>
  <option value="1">Subract .1 from all times</option>
  <option value="2">Subract .2 from all times</option>
  <option value="3">Subract .3 from all times</option>
  <option value="4">Subract .4 from all times</option>
</select>-->
<!--<input style="float: right;" type="range"  min="0" max="5"  value="5" onchange="adjustSlider(this.value)"/>-->
<div id="confirmation">
You have unsaved changes. Press 'Exit' to lose them, or 'Cancel' and then "save" to save them.
</div>
<p style="clear:both;"></p> 

<%= text %>
</body>
</html>